<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>07_猜数字练习</title>
</head>
<body>
    <h3>请输入1-100之间的数字：</h3>
    <input type="text" placeholder="请输入你猜的数字！" id="i1">
    <button onclick="guess()">点击验证</button>
    <br>
    <br>
    <h3>小提示： <span></span></h3>
    <script>
        // Math.random();//0-1之间的随机小数
        let num = parseInt(Math.random()*100)+1;//[1-101)
        console.log('打个小抄：' + num);
        let count = 0;
        let spanE = document.querySelector('span');
        const guess = ()=>{
            let g = document.getElementById('i1').value;//获取输入框中的数据
            //对数据做合法性校验
            // if (isNaN(g)){
            //一对正斜杠（/）用来包裹正则表达式
            // ^表示开头，$表示结尾,\d 表示数字，+表示至少出现一次
            //.test(参数) 用来判断是否匹配前面的正则表达式，匹配则返回true，否则返回false
            if (!/^\d+$/.test(g)){
                alert('请输入数字！');
                return;
            }
            //每猜一次就增加一次计数
            count++;
            if (g > num){
                spanE.innerHTML = '猜大了！';
            }else if(g < num){
                spanE.innerHTML = '猜小了！';
            } else {
                spanE.innerHTML = '恭喜你用了'+count+'次就猜对了！';
            }
        }
    </script>
</body>
</html>